<template>
  <div>
    <div>我是一个child组件</div>
    <table width="600" border="1">
      <thead>
        <tr>
          <th>id</th>
          <th>姓名</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="item in users" :key="item.id">
          <td>{{ item.id }}</td>
          <td>{{ item.name }}</td>
          <td>
            <!--
               给slot标签添加属性传值方式 作用域插槽 
               作用域插槽：子把数据传给父组件
            -->
            <slot :uid="item.id" :a="1" :b="2">
              <button @click="editUser(item.id)">修改</button>
            </slot>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  props: ['users'],
  methods: {
    editUser(id) {
      console.log(id)
    }
  }
}
</script>

<style lang="scss" scoped></style>
